<%@ taglib uri="/tags/struts-bean" prefix="bean"%>
<%@ taglib uri="/tags/struts-html" prefix="html"%>
<%@ taglib uri="/tags/struts-logic" prefix="logic"%>
<%@ taglib uri="/tags/core" prefix="c"%>
<%@ taglib uri="/tags/fmt" prefix="fmt"%>

<fmt:setBundle basename="messages"/>
<html>
<head>
<title>Index File</title>
<LINK REL="StyleSheet" HREF="css/style.css" TYPE="text/css" />
<LINK REL="StyleSheet" HREF="css/principal.css" TYPE="text/css" />
<script type="text/javascript" src="js/calendar/PopupWindow.js"></script>
<script type="text/javascript" src="js/calendar/CalendarPopup.js"></script>
<script type="text/javascript" src="js/calendar/AnchorPosition.js"></script>
<script type="text/javascript" src="js/calendar/date.js"></script>
<script type="text/javascript">  
								
			
		
		function validateForm(){
	    	var errorLen  = '';
	    	var reference = document.getElementById("reference");
	    	var fpquantity = document.getElementById("fpquantity");
	    	var unitprice = document.getElementById("unitprice");
	    	var purchasedate = document.getElementById("purchasedate");
	    	var custs = document.getElementById("custs");
	    	var total = 0;
	    		
	    	if(fpquantity.value == '')
	    		errorLen = errorLen + '<bean:message key="error.message.futurepurchase.wrong.contract.number"/>\n';
	    	if(unitprice.value == '' || (isNaN(unitprice.value)))
	    		errorLen = errorLen + '<bean:message key="error.message.futurepurchase.wrong.price"/>\n';
	    	if(trim(purchasedate.value) == ''){
	    		errorLen = errorLen + '<bean:message key="error.message.futurepurchase.wrong.empy"/>\n';
		    }else if(!isValidDate(trim(purchasedate.value))){
		    	errorLen = errorLen + '<bean:message key="error.message.futurepurchase.wrong.date"/>\n';
		    }
	    	if(custs!=null && custs.value > 0){
	    		for(i = 0; i<custs.value; i = i+1 ){
	    			var qf = document.getElementById("qf" + i )
	    			var qd = document.getElementById("qd" + i )
	    			if((qf.value == "" && qd.value == "") ||  (qf.value == "0" && qd.value == "0")){
	    				errorLen = errorLen + '<bean:message key="error.message.futurepurchase.enter.amount.for.all.customers"/>\n';
	    				break;
	    			}
	    			if(!(qf.value == "") && (isNaN(qf.value))){
	    				errorLen = errorLen + '<bean:message key="error.message.futurepurchase.enter.amount.for.all.customers"/>\n';
	    				break;
	    			}else if(!(qf.value == "") && !isNaN(qf.value)){
	    				total = total + parseInt(qf.value);
	    			}
	    			if(!(qd.value == "") && (isNaN(qd.value))){
	    				errorLen = errorLen + '<bean:message key="error.message.futurepurchase.enter.amount.for.all.customers"/>\n';
	    				break;
	    			}else if(!(qd.value == "") && !isNaN(qd.value)){
	    				total = total + parseInt(qd.value);
	    			}
	    		}
	    	}
			if(total > parseInt(fpquantity.value)){
				errorLen = errorLen + '<bean:message key="error.message.futurepurchase.quantity.exceeded"/>\n';
			}
	    	return errorLen;
		}
		
		function submitForm(action){			
			var form = document.getElementById('mainForm');
	    	form.action = action;
			if(action == 'futurePurchaseUpdate.do' || action == 'futurePurchaseAdd.do'){
		    	var errors = validateForm();
	    		if( errors == '' ){
	    			form.submit();
	    		}else{
	   				alert('Errores :  \n' + errors);
	    		}			
			}else{
				form.submit();
			}
		}
			
		
		var calFechaNacimiento = new CalendarPopup("div_fechaNacimiento");
	    calFechaNacimiento.showNavigationDropdowns();
    	calFechaNacimiento.setCssPrefix("TEST");
	    calFechaNacimiento.setYearSelectStartOffset(80);
    	function openCalendar(dateField){
			calFechaNacimiento.select(dateField,'img_purchasedate','dd/MM/yyyy'); 
			return false;
    	}
    	
    	function clearTheOther(obj, index, e){    	
    		var k, retVal;
		    document.all ? k = e.keyCode : k = e.which;		    
		    if (k != 9){
	    		if((obj.id) == ("qf" + index) )	{
	    			var quantityIn1 = document.getElementById("qd" + index);    			
	    			 quantityIn1.value = "";
	    		}else{
	    			var quantityIn2 = document.getElementById("qf" + index);
	    			quantityIn2.value = "";
	    		}
	    	}	
    	}

		
		function calculateTotals(){		
			var custs = document.getElementById("custs");
			var fieldTotalFixed = document.getElementById("totalFixed");
			var fieldTotalDirect = document.getElementById("totalDirect");
			var fieldTotalEarly = document.getElementById("totalEarly");
			var fieldQuantity = document.getElementById("fpquantity");			
			var totalFixed = 0;
			var totalDirect = 0;
			if(custs!=null && custs.value > 0){
	    		for(i = 0; i<custs.value; i = i+1 ){
	    			var qf = document.getElementById("qf" + i )
	    			var qd = document.getElementById("qd" + i )	    			
	    			if(!(qf.value == "") && !(isNaN(qf.value))){
	    				totalFixed = totalFixed + (+qf.value)
	    			}
	    			if(!(qd.value == "") && !(isNaN(qd.value))){
	    				totalDirect = totalDirect + (+qd.value)
	    			}
	    			
	    			
	    			//if(!(qd.value == "") && (isNaN(qd.value))){
	    				//errorLen = errorLen + '<bean:message key="error.message.futurepurchase.add.products.to.customers"/>\n';
	    				//break;
	    			//}
	    		}
	    		fieldTotalFixed.value = totalFixed;
	    		fieldTotalDirect.value = totalDirect;
	    		fieldTotalEarly.value = fieldQuantity.value - (totalFixed + totalDirect);
	    		
	    	}else{
	    		fieldTotalEarly.value = fieldQuantity.value;	    		
	    	}
		}

		function selectApplicationPeriod(field){
			var applicationFuturePeriodId = document.getElementById("futurePurchaseView.applicationFuturePeriodId");
			applicationFuturePeriodId.options[field.selectedIndex].selected = true;
		}
		</script>
</head>
<DIV ID="div_fechaNacimiento"
	STYLE="position:absolute;visibility:hidden;background-color:white;layer-background-color:white;"></DIV>
<body>
<html:form action="/futurePurchaseAdd" styleId="mainForm">

	<br />
	<table>
		<tr>
			<td>

			<table width="300px" cellpadding="2" cellspacing="1" border="0" bgcolor="#CCCCC0">
				<tr>
					<td class="etiqueta" width="50%" ><bean:message key="message.futurepurchase.periodaccount"/></td>
					<td class="etiqueta_campo" width="50%"><html:select property="futurePurchaseView.accountFuturePeriodId" styleClass="campo_texto" style="width:110px" onchange="selectApplicationPeriod(this);">
						<html:optionsCollection name="FuturePurchaseForm" property="arrLperiodService" value="periodId" label="periodName"/>
					</html:select></td>
					
				</tr>
				<tr>
					<td class="etiqueta"><bean:message key="message.futurepurchase.periodapplication"/></td>
					<td class="etiqueta_campo" width="50%"><html:select property="futurePurchaseView.applicationFuturePeriodId" styleClass="campo_texto" style="width:110px">
						<html:optionsCollection name="FuturePurchaseForm" property="arrLperiodService" value="periodId" label="periodName"/>
					</html:select></td>
				</tr>
				<tr>
					<td class="etiqueta" width="50%"><bean:message key="message.futurepurchase.reference"/>:</td>
					<td class="etiqueta_campo" width="50%"><html:text styleClass="campo_texto" style="width:110px; "
						property="futurePurchaseView.reference" styleId="reference" onclick="this.focus()" >
						</html:text>
						</td>
				</tr>
				<tr>
					<td class="etiqueta" width="50%"><bean:message key="message.futurepurchase.contracts"/>:</td>
					<td class="etiqueta_campo" width="50%"><html:text onblur="javascript:calculateTotals()" styleClass="columnanumero" 
						property="futurePurchaseView.quantity" style="width:110px"
						onkeydown="return (numeric(event,0) && noPaste(event, this));"  
						onkeyup="extractNumber(this,2,false);"
						styleId="fpquantity" onclick="this.focus()" /></td>
				</tr>
				<tr>
					<td class="etiqueta" width="50%"><bean:message key="message.futurepurchase.price"/>:</td>
					<td class="etiqueta_campo" width="50%">
						<input type="text" name="futurePurchaseView.unitPrice" value="<fmt:formatNumber pattern="###,####0.0000" type="number" maxFractionDigits="4" value="${FuturePurchaseForm.futurePurchaseView.unitPrice}"/>" class="columnanumero" onclick="this.focus()" id="unitprice" style="width:110px" onkeydown="return numeric(event,1)"  onkeyup="extractNumber(this,4,false);"/>
					</td>
				</tr>
				<tr>
					<td class="etiqueta" width="50%"><bean:message key="message.futurepurchase.cornorigin"/>:</td>
					<td class="etiqueta_campo" width="50%">
						<html:select property="futurePurchaseView.cornOrigin" styleClass="campo_texto" style="width:110px">
						<html:option value="I"><bean:message key="message.futurepurchase.cornorigin.imported"/></html:option>
						<html:option value="N"><bean:message key="message.futurepurchase.cornorigin.national"/></html:option>
					</html:select></td>

				</tr>
				<tr>
					<td class="etiqueta" width="50%"><bean:message key="message.futurepurchase.purchase.date"/>:</td>
					<td class="etiqueta_campo" width="50%" valign="middle">
					<html:text property="futurePurchaseView.purchaseDate" 
						styleClass="campo_texto" 
						styleId="purchasedate" style="width:110px" />
					<a
						href="javascript:var obj_dummy = openCalendar(document.getElementById('purchasedate'));"
						class="pointerhand" NAME="img_purchasedate" ID="img_purchasedate"><img
						id="fechatrigger" src="images/calendar.gif" border="0" /></a></td>
				</tr>
			</table>


			</td>
		</tr>
		<tr>
			<td colspan="3">

			<table>
				<tr>
					<td class="campo_texto"><bean:message key="message.futurepurchase.customer.search"/><BR/><html:text property="customerViewSearch.description" onfocus="this.select();" styleClass="campo_texto" ></html:text>
					</td>
					<td>&nbsp;<BR/><input type="button" value="..." class="boton_short" onclick="javascript:submitForm('fpaCustomerSearch.do')" /></td>
				</tr>
			</table>
			<br />
			</td>
		</tr>
		<tr>
			<td>
			<table>
				<tr>
					<td valign="top">
					<table cellpadding="2" cellspacing="1" border="0" bgcolor="#CCCCC0">

						<tr class="titulocolumna" >
							<td >&nbsp;</td>
							<td ><bean:message key="message.futurepurchase.customer.code"/></td>
							<td ><bean:message key="message.futurepurchase.customer.name"/></td>
						</tr>
						<c:forEach items="${FuturePurchaseForm.resultCustomerViews}"
							var="cust" varStatus="i">
							
							<tr class="<c:choose><c:when test="${i.index%2 == 0}"><c:out value="columnadatoPar" /></c:when><c:otherwise><c:out value="columnadatoNon" /></c:otherwise></c:choose>">
								<td class="columnadato"><input type="checkbox" 
									value='<c:out value="${cust.customerId}"/>'
									id='fc<c:out value="${i.index}"/>' name="selectedCustomerIds"   /></td>
								<td><label for='fc<c:out value="${i.index}"/>'
									class="columnadato"><c:out value="${cust.customerId}" /></label></td>
								<td><label for='fc<c:out value="${i.index}"/>'
									class="columnadato"><c:out value="${cust.description}" /></label></td>

							</tr>
						</c:forEach>
						<tr>
							<td></td>
						</tr>
					</table>

					</td>
					<td valign="top">

					<table style="height: 100% ">
						<tr style="text-align: center; vertical-align: middle;">
							<td><input type="button" value="<bean:message key="label.common.add"/> >"
								style="width: 80px" class="boton"
								onclick="javascript:submitForm('fpaCustomerAdd.do')" /></td>
						</tr>
						<tr style="text-align: center;">
							<td><input type="button" style="width: 80px" class="boton"
								value="< <bean:message key="label.common.remove"/>"
								onclick="javascript:submitForm('fpaCustomerRemove.do')" /></td>

						</tr>
					</table>

					</td>
					<td valign="top" align="left">
					<table
						style="background-color: #FFFFFF; border-style:solid; border-width:1px; border-color: #cacaca"
						cellspacing="1">
						<tr class="titulocolumna" >
							<td  class="titulocolumna" style="width: 5px"></td>
							<td  class="titulocolumna" style="width: 10px"><bean:message key="message.futurepurchase.customer.code"/></td>
							<td  class="titulocolumna" style="width: 30px"><bean:message key="message.futurepurchase.customer.name"/></td>
							<td  class="titulocolumna" style="width: 10px"><bean:message key="label.futuretype.F"/></td>
							<td  class="titulocolumna" style="width: 10px"><bean:message key="label.futuretype.D"/></td>
							<td  class="titulocolumna" style="width: 50px"><bean:message key="message.futurepurchase.products"/></td>
							<td  class="titulocolumna" style="width: 5px"><bean:message key="message.futurepurchase.products.assign"/></td>
							<td  class="titulocolumna" style="width: 5px"></td>

						</tr>
							
						<c:forEach var="customerPurchase"
							items="${FuturePurchaseForm.futurePurchaseView.customerPurchases}"
							varStatus="loop">
							
							<tr class="<c:choose><c:when test="${loop.index%2 == 0}"><c:out value="columnadatoPar" /></c:when><c:otherwise><c:out value="columnadatoNon" /></c:otherwise></c:choose>">
								<td><input type="checkbox"
									value='<c:out value="${customerPurchase.customerId}"/>'
									id='sc<c:out value="${loop.index}"/>' name="removedCustomerIds" />
								</td>
								<td class="columnadato"><bean:write name="customerPurchase"
									property="customerId" /></td>
								<td class="columnadato"><bean:write name="customerPurchase"
									property="description" /></td>
								<td class="columnaCaptura"><input style="text-align:right;width:60px" class="columnanumero"
									onblur="javascript:calculateTotals()"									
									onfocus="this.select();" 
									value='<c:out value="${customerPurchase.quantityFixed}"/>'
									name='futurePurchaseView.customerPurchases[<c:out value="${loop.index}"/>].quantityFixed'
									id='qf<c:out value="${loop.index}"/>'
									onkeydown="clearTheOther(this,'<c:out value="${loop.index}"/>',event); return (numeric(event,0) && noPaste(event, this));" />

								</td>
								<td class="columnaCaptura"><input style="text-align:right;width:60px" class="columnanumero"									
									onblur="javascript:calculateTotals()"
									onfocus="this.select();" 
									value='<c:out value="${customerPurchase.quantityDirect}"/>'
									name="futurePurchaseView.customerPurchases[<c:out value="${loop.index}"/>].quantityDirect"
									id='qd<c:out value="${loop.index}"/>'
									onkeydown="clearTheOther(this,'<c:out value="${loop.index}"/>',event); return (numeric(event,0) && noPaste(event, this));" />

								</td>
								<td class="columnadato" width="90px"><bean:write name="customerPurchase" property="productPurchaseViewsCSV" /></td>
								<td><input type="button" value="..." class="boton_short" onclick='javascript:submitForm("fpaCustomerAssignProducts.do?customerId=<bean:write name="customerPurchase" property="customerId" />")' /><input type='hidden' value='<c:out value="${FuturePurchaseForm.futurePurchaseView.customerPurchasesSize}"/>' id='custs' />
								</td>
							</tr>
							
						</c:forEach>
						<tr>
							<td colspan="7">
							<hr />
							</td>
						</tr>
						<tr>
							<td class="etiqueta"></td>
							<td class="etiqueta"></td>
							<td class="etiqueta" ><bean:message key="message.futurepurchase.totals"/></td>
							<td align="right"><html:text property="totalFixed" readonly="true" styleId="totalFixed" styleClass="columnanumero" style="width:60px"/></td>
							<td align="right"><html:text property="totalDirect" readonly="true" styleId="totalDirect"  styleClass="columnanumero" style="width:60px"/></td>
							<td></td>
							<td></td>
						</tr>
						<tr>
							<td class="etiqueta"></td>
							<td class="etiqueta"></td>
							<td class="etiqueta"></td> 
							<td class="etiqueta"><bean:message key="message.futurepurchase.advanced.purchase"/>:</td>
							<td align="right"><html:text property="totalEarly" readonly="true" styleClass="columnanumero" style="width:60px" styleId="totalEarly" /></td>
							<td></td>
							<td></td>
						</tr>

					</table>
					</td>
				</tr>

			</table>
			</td>
		</tr>
		<tr>
			<td align="center">
			<br/>
			<table style="border-style:solid; border-width:1px; border-color: #cacaca" cellspacing="1">

				<tr class="columnadatoPar">
					
					<td><logic:equal name="FuturePurchaseForm" value="false" property="updateForm">
						<html:button styleClass="boton" property="save" onclick="javascript:submitForm('futurePurchaseAdd.do')" ><bean:message key="label.common.save"/></html:button>
						
					</logic:equal> <logic:equal name="FuturePurchaseForm" value="true"
						property="updateForm">
						<input type="button" value="<fmt:message key="label.common.save"/>" class="boton"
							onclick="javascript:submitForm('futurePurchaseUpdate.do')" />
					</logic:equal>&nbsp;&nbsp;&nbsp;</td>
					<td ><input type="button" value="<fmt:message key="label.common.cancel"/>"
						onclick="location.href = 'showFuturePurchaseQuery.do';" class="boton" />
					</td>
				</tr>
			</table>
			</td>
		</tr>
	</table>
</html:form>
<script>
	cleanNumber(document.getElementById('fpquantity'));
	cleanNumber(document.getElementById('unitprice'));
	var custs = document.getElementById("custs");
	if(custs!=null){
		for(i = 0; i<custs.value; i = i+1 ){
   			cleanNumber(document.getElementById("qf" + i ));
   			cleanNumber(document.getElementById("qd" + i ));	    			
		}
	}
</script>
</body>
</html>
